<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Welcome!</title>
<link href="css/style.css" rel="stylesheet" type="text/css" />
<script language="JavaScript" type="text/javascript">
		function validatePage() {
			var error = "";
	
			if (document.getElementById("user").value == "") {
				error = error + "Please enter the username.\n";
			}
			if (document.getElementById("pass").value == "") {
				error = error + "Please enter the password.\n";
			}
			if (error != "") {
				alert(error);
				return false;
			} else {
				return true;
			}
		}
	</script>
<script>
	function validateName() {
		var error = "";
		if(request.getAttribute("userNotExists")==true)
			var error = "Please enter a valid username.\n";
		
		if (error != "") {
			alert(error);
			return false;
		} else {
			return true;
		}
		
	}
</script>
<script>
		function validPassword(){
			var error = "";
			
			if (document.getElementById("name").value == "") {
				error = error + "Please enter your name.\n";
			}
			if (document.getElementById("surname").value == "") {
				error = error + "Please enter your surname.\n";
			}
			if (document.getElementById("username").value == "") {
				error = error + "Please enter a username.\n";
			}
			if (document.getElementById("email").value == "") {
				error = error + "Please enter your E-Mail adress.\n";
			}
			if (document.getElementById("ps").value == "") {
				error = error + "Please enter a password which does not contain any Turkish character.\n";
			}
			if (document.getElementById("reps").value == "") {
				error = error + "Please re-type your password.\n";
			}
			if (document.getElementById("ps").value.indexOf("ş")!=-1 
					||	document.getElementById("ps").value.indexOf("ğ")!=-1
					||	document.getElementById("ps").value.indexOf("ı")!=-1
					||	document.getElementById("ps").value.indexOf("ö")!=-1
					||	document.getElementById("ps").value.indexOf("ü")!=-1
					||	document.getElementById("ps").value.indexOf("ç")!=-1) {
					error = error + "Your password contains a Turkish character. \n";
				}
			if(!(document.getElementById("ps").value===document.getElementById("reps").value)){
				error = error + "Passwords do not match";
			}
			if (error != "") {
				alert(error);
				return false;
			} else {
				return true;
			}
		}
	</script>
</head>
<body>

	<div class="header">
		<div class="wrapper">
			<div class="logo">
				<img src="images/banner.jpg" alt="" />
			</div>

			<%
			if( session.getAttribute("userName")==null)
			{
			%>

			<div class="login">
				<form name="dummy" action="Login" method="post">
					<div>
						<c:if test="${invalidLogin == true}">
							<p style="color: red">
								<b>Your username or password is incorrect.</b>
							</p>

						</c:if>
						<c:if test="${forgotPassword == true}">
							<p style="color: red">
								<b>Your password has been sent to your e-mail.</b>
							</p>

						</c:if>
						<c:if test="${userNotExists == true}">
							<p style="color: red">
								<b>Please enter a valid username.</b>
							</p>

						</c:if>
						<c:if test="${validRegister == true}">
							<p style="color: red">
								<b>You have registered successfully.You can login now.</b>
							</p>

						</c:if>

					</div>

					<div class="form-input">
						<label>Username</label> <input name="name" type="text" id="user"
							value="" />
					</div>
					<div class="form-input">
						<label>Password</label> <input name="password" type="password"
							id="pass" value="" />
					</div>
					<div class="form-input">
						<input name="button" type="submit" value="Login"
							onclick="return validatePage();">
					</div>
					<div class="form-input" style="margin-right: 0">
						<input name="button" type="submit" value="Forgot Password?"
							onclick="return validateName();">
					</div>
				</form>
			</div>

			<% }  

else {%>
			<div class="login user">

				<form name="dummy" action="Logout" method="post">
					<div class="form-input" style="margin-right: 0">
						<p>
							Hi,
							<%=session.getAttribute("userName")%></p>
						<input type="submit" value="Logout" />
					</div>
				</form>
			</div>

			<% }  

%>


		</div>
	</div>

	<div class="content">
		<div class="wrapper">
			<div class="leftmenu">
				<ul>
					<li><a href="default.jsp">Home Page</a></li>
					<%
					if( session.getAttribute("userName")!=null)
					{
					%>
					<li><a href="homeMember.jsp">Profile Page</a></li>
					<li><a href="addReport.jsp">Add Report</a></li>
					<%}%>
					<li><a href="searchPage.jsp">Search For a Report</a></li>
					<li><a href="default.jsp">How It Works</a></li>

				</ul>
			</div>

			<div class="centercol">


				<h3>HOW IT WORKS</h3>
				<p>Welcome on "Accessibility Violations" social responsibility
					project developed by Boğaziçi University Students.</p>
				<ul class="list">

					<li>Fill out the form and register in seconds!</li>
					<li>Login & contribute to our system to increase awareness!</li>
					<li>Report & follow violations and friendly locations near you
						easily and help others!</li>

				</ul>
				<p>
					<strong>Use left navigation on each page & enter the inside of our world!</strong>
				</p>
				

			</div>
			<%
if( session.getAttribute("userName")==null)
{
%>
			<div class="rightcol">

				<h3>Register</h3>

				<form action="Register" method="post" class="register">

					<div class="register-form">
						<label>Name</label> <input name="name" type="text" id="name" />
					</div>

					<div class="register-form">
						<label>Surname</label> <input name="surname" type="text"
							id="surname" />
					</div>

					<div class="register-form">
						<label>Username</label> <input name="username" type="text"
							id="username" />
					</div>

					<div class="register-form">
						<label>E-Mail</label> <input name="email" type="text" id="email" />
					</div>

					<div class="register-form">
						<label>Password</label> <input name="password" type="password"
							id="ps" />
					</div>
					<div class="register-form">
						<label>Re-Type Password</label> <input name="repassword"
							type="password" id="reps" />
					</div>

					<div class="register-form">
						<input name="button" type="submit" value="Register"
							onclick="return validPassword();" />
					</div>

				</form>

				<%} %>
				<div class="and-market">
					<img src="images/and-market.png" alt="" />
				</div>

			</div>

		</div>
	</div>

	<!-- <div class="footer">
	<div class="wrapper">
		<p>Boğaziçi Üniversitesi Accessibility Violations Project<br />&copy;2012</p>    
    </div>	
</div> -->

</body>
</html>
